<template>
  <div>
    <el-dialog
      v-model="dialogVisibles"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      destroy-on-close
      :show-close="false"
      title="客户查询"
      width="60%"
      draggable
    >
      <template #header>
        <div class="customerTitle2">{{ titleType(props.statusType) }}</div>
      </template>
      <div>
        <div class="customerDialog1">
          <span class="customerDialog2">
            {{ titleType1(props.statusType) }}
          </span>
          <el-select
            v-model="share_value"
            class="m-2"
            filterable
            @change="shareDate(props.statusType)"
          >
            <el-option
              v-for="item in dataSelect(props.statusType)"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </div>
        <div class="customerTable">
          <el-table
            border
            :class=" props.statusType == 1 ? 'tab_Background1' : props.statusType == 2? 'tab_Background2'  : 'tab_Background3' "
            :data="multiple_list"
            height="300px"
            size="small"
          >
            <el-table-column
              empty-text="--"
              label="使用组织"
              prop="org_name"
              width="230"

            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.org_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="客户编码"
              prop="number"
              width="130"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.number,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="客户名称"
              prop="name"
              min-width="200"
            >
              <template #default="scope">
                <span class="ellipsis">
                  {{ scope.row.name || "--"}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
              label="客户状态"
              prop="status"
              width="100"
            >
              <template #default="scope">
                <span>
                  {{ status_name(scope.row.status)}}
                </span>
              </template>
            </el-table-column>
            <el-table-column
              label="客户类别"
              prop="cust_type_name"
              width="150"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.cust_type_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="客户分组"
              prop="primary_group_name"
              show-overflow-tooltip
              width="150"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.primary_group_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="是否为集团客户"
              prop="is_group"
              width="130"
            >
              <template #default="scope">
                <el-tag
                  :type="scope.row.is_group === 1 ? 'success' : 'danger'"
                  disable-transitions
                >{{ scope.row.is_group == 1 ? '是' : '否' }}</el-tag
                >
              </template>
            </el-table-column>
            <el-table-column
              label="结算币别"
              prop="trading_curr_name"
              width="100"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.trading_curr_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="价目表"
              prop="price_list_name"
              width="80"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.price_list_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="价目表编码"
              prop="price_list_number"
              width="100"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.price_list_number,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="发票类型"
              prop="invoice_type_name"
              width="100"
            >
              <template #default="scope">
                <span class="ellipsis">{{ scope.row.invoice_type_name && scope.row.invoice_type_name == 0 ? '--': scope.row.invoice_type_name || '--'}}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="是否启用信用管理"
              prop="is_credit_check"
              width="140"
            >
              <template #default="scope">
                <el-tag
                  :type="scope.row.is_credit_check === 1 ? 'success' : 'danger'"
                  disable-transitions
                >{{ scope.row.is_credit_check == 1 ? '是' : '否' }}</el-tag
                >
              </template>
            </el-table-column>
            <el-table-column
              label="创建人"
              prop="create_name"
              width="80"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.create_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="创建组织"
              prop="create_org_name"
              width="100"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.create_org_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="创建时间"
              prop="create_date"
              width="180"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.create_date,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="更新人"
              prop="update_name"
              width="100"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.update_name,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="更新组织"
              prop="modify_use_org"
              width="100"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.modify_use_org,  '')"
              ></span>
              </template>
            </el-table-column>
            <el-table-column
              label="更新时间"
              prop="update_date"
              width="180"
            >
              <template #default="scope">
              <span
                class="ellipsis"
                v-text="_FieldFormat(scope.row.update_date,  '')"
              ></span>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <template #footer>
        <span class="dialog-footer customerDialog3">
          <el-button type="primary" @click="share_save(props.statusType)">保存</el-button>
          <el-button @click="share_cancel">取消</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts">

  import {FieldFormat} from "/@/utils/utils";

  defineOptions({
    name: 'ShareOrganization',
  })
  import {customer_updateBatch} from "/@/api/dms/customer";
  import { defineProps, ref } from 'vue'
  import {ElMessage} from "element-plus";
  let multiple_list = reactive<any>([])
  const status_name =(va:any)=>{
    if(va == 0){
      return '暂存'
    }else if(va == 1){
      return  '待审核'
    }else if(va == 2){
      return  '已审核'
    }else if(va == 3){
      return '待完善'
    }else if(va == 4){
      return '已更新'
    }
  }
  const props = defineProps([
    'dialogVisible',
    'statusType',
    'multipleDate',
    'organizationList',
    'customer_category',
    'customerGroupList'
    // 'multipleDate1',
  ])
  const _FieldFormat = (value: string, type = '') => {
    return FieldFormat(value, type)
  }
  const dialogVisibles = ref(props.dialogVisible)
  const types = ref(props.statusType)
  const select_id = ref(null)
  onBeforeUpdate(() => {
    dialogVisibles.value = props.dialogVisible
    multiple_list = props.multipleDate
    types.value = props.statusType
    // multiple_list1 = props.multipleDate1
  })
  const $emits = defineEmits([
    'update:dialogVisible',
    'update:statusType',
    'update:multipleDate',
    // 'update:multipleDate1',
  ])
  const titleType = (va: number) => {
    if (va == 1) {
      return '分配使用组织'
    } else if (va == 2) {
      return '客户分组'
    } else if (va == 3) {
      return '客户分类'
    } else {
      return ' '
    }
  }
  const titleType1 = (va: number) => {
    if (va == 1) {
      return '使用组织'
    } else if (va == 2) {
      return '客户分组'
    } else if (va == 3) {
      return '客户类别'
    } else {
      return ' '
    }
  }
  const share_value = ref('')

  let share_options = reactive(props.organizationList || [])
  let custom_grouping_options = reactive( props.customerGroupList || [])
  let custom_classify_options = reactive(props.customer_category || [])
  watchEffect(()=>{
    share_options = props.organizationList || []
    custom_grouping_options = props.customerGroupList || []
    custom_classify_options = props.customer_category || []
  })
  //选择框的数据
  const dataSelect = (va: number) => {
    if (va == 1) {
      return share_options
    } else if (va == 2) {
      return custom_grouping_options
    } else if (va == 3) {
      return custom_classify_options
    } else {
      return []
    }
  }
  // 选择以后更改数据
  const shareDate = (va: any,val:any) => {
    select_id.value = va
    if (va == 1) {
      multiple_list = props.multipleDate.map((item: any) => {
        return {
          ...item,
          use_org_name: share_options.filter((i:any)=> i.value == share_value.value )[0].label,
        }
      })
    } else if (va == 2) {
      multiple_list = props.multipleDate.map((item: any) => {
        return {
          ...item,
          primary_group_name: custom_grouping_options.filter((i:any)=> i.value == share_value.value )[0].label,
        }
      })
    } else if (va == 3) {
      multiple_list = props.multipleDate.map((item: any) => {
        return {
          ...item,
          cust_type_name: custom_classify_options.filter((i:any)=> i.value == share_value.value )[0].label,
        }
      })
    } else {
      return []
    }
  }
// 保存
  const share_save = (va:any) => {
    if(va == 1){
      customer_updateBatch({list:[...multiple_list],use_org_id:share_value.value,use_org_name:share_options.filter((i:any)=> i.value == share_value.value )[0].label}).then(()=>{
        $emits('update:dialogVisible', false)
        $emits('update:multipleDate', multiple_list)
        $emits('update:statusType', 0)
        ElMessage({
          message: '分配成功',
          type: 'success',
        })
      })
    }else if(va == 2){
      customer_updateBatch({list:[...multiple_list],primary_group:share_value.value,primary_group_name:custom_grouping_options.filter((i:any)=> i.value == share_value.value )[0].label}).then(()=>{
        $emits('update:dialogVisible', false)
        $emits('update:multipleDate', multiple_list)
        $emits('update:statusType', 0)
        ElMessage({
          message: '分配成功',
          type: 'success',
        })
      })
    }else if(va == 3){
      customer_updateBatch({list:[...multiple_list],cust_type_id:share_value.value,cust_type_name:custom_classify_options.filter((i:any)=> i.value == share_value.value )[0].label}).then(()=>{
        $emits('update:dialogVisible', false)
        $emits('update:multipleDate', multiple_list)
        $emits('update:statusType', 0)
        ElMessage({
          message: '分配成功',
          type: 'success',
        })
      })
    }

    // $emits('update:multipleDate1', multiple_list)
    // dialogVisible.value = false
    share_value.value = ''
    // multipleDate1 = multipleDate
  }
  const share_cancel = () => {
    $emits('update:dialogVisible', false)
    $emits('update:multipleDate', props.multipleDate)
    // $emits('update:multipleDate1', multiple_list1)
    share_value.value = ''
    select_id.value = null
  }
</script>

<style lang="scss" scoped>
  @import '../index.scss';
</style>
